<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>学生信息</title>
    <script src="js/jquery-3.4.1.min.js"></script>
    <script>
        $(function(){
            var pageNo=1;
            var name="",tel="";
            var totalPage=1;
            function doQuery(pageNo,name,tel){
                $.get("studentSearch.do",{pageNo:pageNo,sname:name,tel:tel},function(p){
                    totalPage=p.totalPage;
                    $("#go").val(pageNo);

                    var t=$("#tab");
                    //t.empty();
                    t.find("tr:gt(0)").remove();
                    $.each(p.datas,function(i,d){
                        t.append("<tr><td>"+d.stuno+"</td><td>"+d.sname+"</td><td>"+d.sex+"</td><td>"+(d.enterdate==null?"":d.enterdate)+"</td><td>"+d.telephone+"</td>"+
                            "<td><a href="+d.stuno+"'updateStudent.html?'>修改</a><a href='#' class='del' stuno='"+d.stuno+"'>删除</a> </td>"
                            +"</tr>");
                    });

                });
            }

            $("#btnSearch").click(function(){
                pageNo=1;
                name=$("input[name=sname]").val();
                tel=$("input[name=tel]").val();

                doQuery(pageNo,name,tel);
                return false;
            });
            $("#pager #first").click(function(){
                pageNo=1;
                doQuery(pageNo,name,tel);
                return false;
            });
            $("#pager #prev").click(function(){
                if(pageNo<=1){
                    alert("已经没有了");
                    return;
                }

                pageNo--;
                doQuery(pageNo,name,tel);
                return false;
            });
            $("#pager #next").click(function(){
                if(pageNo>=totalPage){
                    alert("已经没有了");
                    return;
                }

                pageNo++;
                doQuery(pageNo,name,tel);
                return false;
            });
            $("#pager #last").click(function(){
                pageNo=totalPage;
                doQuery(pageNo,name,tel);
                return false;
            });
            //
            $("#go").keydown(function(event){
                if(event.keyCode==13){//回车
                    pageNo=parseInt($(this).val());
                    doQuery(pageNo,name,tel);
                }
            }).blur(function(){
                pageNo=parseInt($(this).val());
                doQuery(pageNo,name,tel);
            });

            //一开始就调一次
            doQuery(pageNo,name,tel);

            $("#tab").on("click","a.del",function(){
                var stuno=$(this).attr("stuno");
                alert(stuno+">>>>>>>>>>>>>>>>");
                $.get("delStudent",{stuno:stuno},function(d){
                    //location.reload()
                });
                return false;
            });
        });
    </script>
</head>
<body>
<form action="student.jsp" method="get" style="width: 50%;margin: 0 auto">
    <input type="text" name="sname" placeholder="姓名" />
    <input type="text" name="tel" placeholder="电话" />
    <input type="date" name="enterStart" placeholder="开始时间"/>
    <input type="date" name="enterEnd" placeholder="结束时间"/>
    <input type="submit" value="搜索" id="btnSearch"/>
</form>
<a href="addStudent.jsp">增加</a>
<table border="2px" cellpadding="0" cellspacing="0" align="center" width="90%" id="tab">
    <tr><td>学号</td><Td>姓名</Td><td>性别</td><td>入学日期</td><td>电话</td><td>操作</td></tr>
</table>
<p id="pager">
 <a href="#" id="first">首页</a>
    <a href="#" id="prev">上一页</a>
    <input type="number" min="1"  id="go" style="width:30px"/>
    <a href="#" id="next">下一页</a>
    <a href="#" id="last">尾页</a>
</p>
</body>
</html>